
/*视图类------提供视图的基本功能，请求数据－－填充数据，上拉加载数据－－－显示数据的功能*/
var LeafView=function(opt){

    //视图 id 与 装载数据的容器 HTML 元素
    this.id=opt.id;
    this.elBox=opt.elBox || null;

    //视图状态控制，
    this.state=opt.state || {};
    this.state= $.extend({},this.state, {
        //没有数据了
        isNoneData:false,
        //是否已注册 loadMoreData事件，防止多次注册；
        isRegLoadMoreData:false
    });


    //请求参数
    this.param=opt.param || {};

    //存储初始分页参数；
   if(opt.param.data.hasOwnProperty("_start")){
       this.oldParamPage= {
           _start:opt.param.data._start || 0,
           _limit:opt.param.data._limit || 10
       };
   }



    //视图：Vue视图实例；
    //添加数据接口 detail用于单条数据的绑定；
    //实例化时，如果没有detail数据接口时，自动添加；
    this.vm=opt.vm || new Vue({
            el: this.elBox||this.id,
            data:{list:[],detail:null}
        });


    if(this.vm.detail===undefined){
        this.vm.detail=null;
    }


    //数据处理，如分组，过滤，由外部传入函数
    this.dataFilter=opt.dataFilter || null;

    //附加数据， 用于在getData()后给返回的数据添加一些新的数据，具体数据由传入的方法决定；
    this.dataAdd=opt.dataAdd || null;

    //是否添加加载更多数据事件
    this.isLoadMore=true;
    if(opt.hasOwnProperty("isLoadMore")){
        this.isLoadMore=opt.isLoadMore;
    }

    opt=null;

    //绑定scroll事件，用于下拉时加载更多内容，加载内容由loadMoreData事件处理函数处理，此处仅用于触发处理；
    var curView=this;
    if(this.isLoadMore){
        $(window).on("scroll",function(){
            if(curView.isFooter()){
                $(curView.id).triggerHandler("loadMoreData",[curView]);
            }
        });
    }
};

LeafView.prototype={
    //填充数据
    fillData:function(isAdd){
        var me=this;
        console.log("2、获取数据",me.id,me.param.data);
        me.getData(me.param).then(
            function (resData) {

                // 数据绑定时，默认都为数组格式，
                //请求返回的为单条数据时-----{}格式，会将数据转为数组，统一数据流通格式；
                //页面如果不想写成 list[0].name的形式，已给vm，添加一个detail属性，me.vm.detail，下面代码中已给 detail赋值，可以直接在详情页中使用，如 rating-team-detail.html;
                var isDetail=false;
                if(resData.constructor !==Array){
                    resData=[resData];
                    isDetail=true;
                }

                //有数据
                if (resData.length > 0) {
                    //数据过滤或分组处理
                    if (typeof me.dataFilter==='function'){
                        resData=me.dataFilter(resData) || [];
                    }

                    //附加数据
                    if (typeof me.dataAdd==='function'){
                        resData=me.dataAdd(resData) || [];
                    }


                    //更新数据，替换 | 叠加；
                    if(isAdd){
                        var list=me.vm.list;
                        me.vm.list=list.concat( resData );
                        list=null;
                    }else{
                        me.vm.list=resData;
                        if(isDetail){
                            me.vm.detail=resData[0];
                            //console.log(me.vm.detail);
                        }
                    }
                    resData=null;


                    //加载数据成功，注册 load more data 事件； 更新参数
                    if(me.isLoadMore){
                        //console.log("3、获取数据成功， 更新参数",me.id,me.param.data);
                        me.onLoadMore();
                        me.param.data._start += me.param.data._limit;
                        me.state.isNoneData=false;
                    }

                }else{
                    //无数据： 即加载了全部数据了；
                    if(me.isLoadMore){
                        //console.log("3、没有获取到数据",me.id,me.param.data,me.oldParamPage);
                        me.offLoadMore();
                        me.state.isNoneData=true;
                    }

                }

                if(me.state.isNoneData){
                    $(".none-data",$(me.id)).show();
                }

            }
            ,function(){
                //加载数据失败
                me.state.isNoneData=false;
                var failBox=$(".load-fail",$(me.id));
                failBox.show();

                if(me.vm.list.length>0){
                    failBox.off("click").on("click", function () {
                        me.fillData(true);
                    });
                }
            }
        );
    },

    //请求数据
    getData:function(opt){

        //test----------------------------------------组装请求路径
        var curLang=EMui.lang.getCurLang();
        var id=1;
        if(curLang=='zh-CN'){
            id=2;
        }else if(curLang=='zh-TW'){
            id=3
        }
        //test----------------------------------------组装请求路径


        //参数处理
        var settings={};
        var defaultOpts={
            url:'',
            data:{
                regionId:EMui.region.getCurRegionId(),
                langId:id
            },
            dataType: "json",
            async: true,
            timeout: 60000,
            beforeSend:function(){
                $(".load-wrap").show();
                $(".load-fail,.none-data").hide();
            },
            complete:function(){
                $(".load-wrap").hide();
            }
        };

        if($.type(opt)==='string' ){
            defaultOpts.url=opt;
            settings=defaultOpts;
        }else{
            settings = $.extend(true, defaultOpts, opt);
        }

        console.log(settings);





        //send request
        return $.ajax(settings).then(
            function(resData){
                //服务端  success=false 时；
                if(!resData.success){
                    //todo  show msg
                    // console.log("请求数据失败，错误代码"+data.errorCode);
                }

                //实际使用只需要返回 resData.data即可
                $(".load-wrap").hide();
                return resData
            }
            ,function(xhrData){
                console.log("request fail todo ....");
                $(".load-wrap").hide();
                //刷新整个页面
                $(".load-fail").show().off("click").on("click",function(){
                    window.location.reload();
                });
                return xhrData;
            }
        );
    },


    isFooter:function(){
        var ret=false;
        var scrollY = $(window).scrollTop();
        var screenH= $(window).height();
        var bodyH=$("body").height();
        if(scrollY+screenH>=bodyH-100){
            //console.log("到底了,该加载数据了，骚年！");
            ret=true;
        }
        return ret;
    },
    onLoadMore:function(){
        console.log("---------注册 loadMoreData 事件------------",this.id);
        if(!this.state.isRegLoadMoreData){
            $(this.id).on("loadMoreData", function(e,view) {
                if(view.state.isShow){
                    view.offLoadMore();
                    view.fillData(true);
                }
            });
            this.state.isRegLoadMoreData=true;
        }
    },
    offLoadMore:function(){
        if(this.state.isRegLoadMoreData){
            console.log(' ');
            console.log("---------注销 loadMoreData 事件----------",this.id);
            $(this.id).off("loadMoreData");
            this.state.isRegLoadMoreData=false;
        }
    }
};


/*命名空间*/
var EMui={
    /*请求配置*/
    urls: {
        domain:'http://localhost:5000/',

        newsHdp: 'newsHdp',
        newsFocus: 'newsFocus',
        newsTransfer: 'newsTransfer',
        newsHeadlines: 'newsHeadlines',

        newsDetail: 'newsFocus',

        pointsType: 'pointsType',
        pointsList: 'pointsList',


        matchFixtures: 'matchFixtures',
        matchResults: 'matchResults',

        ratingTeams:'ratingTeams',
        ratingPlayers:'ratingPlayers',
        ratingTeamDetail:'ratingTeamDetail',
        ratingPlayerDetail:'ratingPlayerDetail'
    },



    /*工具函数*/
    utils:{

        //获取url中的参数值
        getUrlParam:function (key) {
            var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if (r != null){
                r= unescape(r[2]);
            }
            return r;
        },

        //设置列表中的某个项为当前项，即当此项中data-val === value 时
        setCurClass:function(opt){
            var def={
                list:null,
                el:null,
                dataValName:'',
                value:'',
                clsName:'cur'
            };
            def=$.extend(def,opt);
            if(def.list.length<=0 || !def.value){return false;}

            var curEl=def.el;
            if(!curEl){
                def.list.each(function(index,item){
                    if($.trim($(item).data(def.dataValName))==def.value){
                        curEl=$(item);
                        return true;
                    }
                });
            }



            curEl.addClass(def.clsName).siblings().removeClass(def.clsName);
        }

    },


    /*本地数据服务*/
    storageService:{
        get: function (key) {
            return store.get(key);
        },

        set: function (key, value) {
            store.set(key, value);
        },

        remove: function (key) {
            store.remove(key);
        },

        removeAll:function(){
            store.clear();
        },

        getAll:function(){
            return store.getAll();
        }
    }

};

/*语言*/
EMui.lang=(function(){

    //当前语言
    var _curLang=EMui.storageService.get("curLang") || 'en';

    return {
        //设置当前语言，（当需要由客户端保存状态时，可以存储到本地）；
        setCurLang:function(lang){
            _curLang=lang;
            this.saveCurLang();
        },


        //获取当前语言
        getCurLang:function(){
            return _curLang;
        },


        //存储到本地
        saveCurLang:function(){
            EMui.storageService.set("curLang",_curLang);
        },


        //语言初始化：即切换语言；
        init:function(){
            this.switchLang();
        },

        //切换语言：设置语言的当前项，更新data-localize项，更新 html 类名
        switchLang:function(){
            var me=this;
            console.log(_curLang);
            if(!_curLang){
                me.setCurLang($('#langBox > a.cur').data('lang')) ;
            }
            var opts = {
                language:_curLang ,
                pathPrefix: "/Esports_Mobile/res/js/lang"
            };
            $("[data-localize]").localize("esports",opts);
            me.setCurClass();

            $("html").removeClass().addClass(_curLang);
        },

        //设置语言的当前项
        setCurClass:function(curBtn){
            EMui.utils.setCurClass({
                list:$("#langBox > a"),
                el:curBtn,
                dataValName:'lang',
                value:_curLang,
                clsName:'cur'
            });
        }
    }

})();


/*区域*/
EMui.region=(function(){

    //当前区域
    var _curRegionId=EMui.storageService.get("curRegion") || 50;

    return {
        //设置当前区域，（当需要由客户端保存状态时，可以存储到本地）；
        setCurRegionId:function(id){
            _curRegionId=id;
            this.saveCurRegionId();
        },

        //获取当前区域
        getCurRegionId:function(){
            return _curRegionId;
        },

        //存储到本地
        saveCurRegionId:function(){
            EMui.storageService.set("curRegion",_curRegionId);
        },

        //区域初始化：即设置区域ID；
        init:function(){
            var me=this;
            console.log(_curRegionId);
            if(!_curRegionId){
                me.setCurRegionId($('#regionArea > li.cur').data('val')) ;
            }
            me.setCurClass();
        },

        //设置区域的当前项
        setCurClass:function(curRegion){
            EMui.utils.setCurClass({
                list:$("#regionArea > li"),
                el:curRegion,
                dataValName:'val',
                value:_curRegionId,
                clsName:'cur'
            });
        }
    }
})();


/*页面功能，事件注册*/
EMui.common= (function(){

    return {
        //设置当前导航页
        setCurPage:function(){
            var pages={
                index:["","/","index","index.html","news","news.html"],
                points:["points","points.html"],
                matches:["matches","matches.html"],
                rating:["rating","rating.html"]
            };
            var curPage='index',
                curUrl= $.trim(location.href).toLowerCase(),
                curArr=[];
            for(var key in pages){
                curArr=pages[key];
                for(var i= 0,len=curArr.length;i<len;i++){
                    if(curUrl.indexOf(curArr[i])>=0){
                        curPage=key;
                        break;
                    }
                }
            }
            EMui.utils.setCurClass({
                list:$("#mainNav >li"),
                dataValName:'name',
                value:curPage,
                clsName:'cur'
            });
        },

        //语言切换
        regLangClick:function(){
            var btns=$('#langBox >a'),
                curBtn=null,
                me=this;
            if(btns.length<=0){return;}

            //btn click
            btns.on('click',function(){
                curBtn=$(this);
                EMui.lang.setCurLang(curBtn.data("lang"));
                EMui.lang.switchLang(curBtn);
                me.reloadPage();
            });
        },

        //区域切换
        regRegionClick:function(){
            var lis=$('#regionArea >li'),
                curLi=null,
                me=this;
            if(lis.length<=0){return;}

            //btn click
            lis.on('click',function(){
                curLi=$(this);
                EMui.region.setCurRegionId(curLi.data("val"));
                EMui.region.setCurClass(curLi);
                me.reloadPage();
            });
        },


        //tab 切换
        tabs: function() {
            $(document).on('click', '.p-tab-h li', function(e) {
                e.preventDefault();
                var curClass = 'cur';
                var li$ = $(this).closest('li');
                var index = li$.index();
                li$.addClass(curClass).siblings().removeClass(curClass);
                li$.closest('.p-tab').find('.p-tab-item').eq(index).show().siblings().hide();
                li$.trigger("changetab");
            });
        },


        //赛区fixed
        locationFilterPos: function () {
            var box = $(".area"),
                nav=  $(" nav ul");
            if(box.length<=0){return;}
            var posY = box.position().top, boxH = "1rem";

            // set top position
            function setTop() {
                var top = $(window).scrollTop();
                if (top > posY) {
                    box.css({ 'position': 'fixed', top: "-1px" });
                    nav.css({"padding-bottom":boxH});
                } else {
                    box.css({ 'position': 'relative', top: 0 });
                    nav.css({"padding-bottom":0});
                }
            }
            $(window).on("scroll",setTop);
        },

        //页面初始化
        initPage:function(){
            console.log("");
            console.log("1、init page-----------------------------");
            var vmName=$("html").data("vue");
            if(vmName && EMui.hasOwnProperty(vmName)){
                if (typeof EMui[vmName] === "object") {
                    EMui[vmName].init();
                }else{
                    throw new Error("EMui."+vmName+"不是对象！");
                }
            }
        },

        //页面重载
        reloadPage:function(){
            console.log("");
            console.log("reload page-----------------------------");
            var vmName=$("html").data("vue");
            if(vmName && EMui.hasOwnProperty(vmName)){
                if (typeof EMui[vmName] === "object") {
                    EMui[vmName].reloadData();
                }else{
                    throw new Error("EMui."+vmName+"不是对象！");
                }
            }
        },

        init:function(){
            EMui.lang.init();
            EMui.region.init();
            this.setCurPage();
            this.locationFilterPos();
            this.tabs();
            this.regLangClick();
            this.regRegionClick();
            this.initPage();
        }
    }
})();



/*Vue 过滤器*/
//格式化日期值，Vue过滤器；依赖 moment.js
/*标准时间  -----  2016年5月5日中午12点16分 */
Vue.filter('formatDateStand', function (value) {
    var curLang= EMui.storageService.get("curLang").toLowerCase();
    var ret=moment(value).format('LLL');
    if(curLang!=='en'){
        moment.locale(curLang);
        ret=moment(value).format('YYYY-MM-DD ')+moment(value).format('HH:mm');
    }

    return ret;
});

/*纯日期或过去的时间，相对于当天-----2016-04-05   or  16小时前    5分钟前*/
Vue.filter('formatDate', function (value) {
    moment.locale(EMui.storageService.get("curLang").toLowerCase());
    var now = moment(),
        publicDate = moment(value),
        diff=now.diff(publicDate),

        maxTime=1*24*60*60*1000,
        ret=moment(value).startOf('day').fromNow();

    if(diff>=maxTime){
        ret=moment(value).format('YYYY-MM-DD ');
    }
    return ret;
});

/*日期，带星期   2016/05/04 星期三*/
Vue.filter('formatDateWeek', function (value) {
    moment.locale(EMui.storageService.get("curLang").toLowerCase());
    var  ret=moment(value).format('YYYY/MM/DD ') + moment(value).format("dddd");
    return ret;
});

/*仅时间 上下午 ----- 15:29 PM */
Vue.filter('formatDateTime', function (value) {
    moment.locale(EMui.storageService.get("curLang").toLowerCase());
    var  ret=moment(value).format('HH:mm A');
    return ret;
});

/*倒计时 -----  剩2天2小时，剩2小时15分*/
Vue.filter('formatDateBack', function (value) {
    function localize(started, day, hour, min) {
        var resources;
        var lang=EMui.storageService.get("curLang");
        switch (lang) {
            case 'zh-CN':
                resources = ['进行中', '剩', '天', '小时', '分', ''];
                break;
            case 'zh-TW':
                resources = ['進行中', '剩', '天', '小時', '分', ''];
                break;
            default:
                resources = ['Started', '', ' day ', ' hr ', ' min ', 'left'];
                break;
        }
        if (started) {
            return resources[0];
        }

        var result = resources[1];
        if (day != null) {
            result += day + resources[2];
        }
        if (hour != null) {
            result += hour + resources[3];
        }
        if (min != null) {
            result += min + resources[4];
        }
        return result + resources[5];
    }
    var oneHour = 60;
    var oneDay = oneHour * 24;
    var diff = moment.utc(value).diff(new Date(), 'minutes');
    if (diff <= 0) {
        return localize(true);
    } else if (diff < oneHour) {
        return localize(false, null, null, diff % oneHour);
    } else if (diff < oneDay) {
        return localize(false, null, Math.floor(diff / oneHour), diff % oneHour);
    } else {
        return localize(false, Math.floor(diff / oneDay), Math.floor((diff % oneDay) / oneHour), null);
    }

});



$(function(){
    EMui.common.init();
});





















